<template>
	<!-- 导航栏 -->
	<van-nav-bar
		title="我的团队"
		left-text="返回"
		left-arrow
		fixed
		placeholder
		z-index="1000"
		@click-left="back"
		@click-right="SearchShow = true"
	>
		<template #right>
			<van-icon name="search" size="20" />
		</template>
	</van-nav-bar>

	<!-- 搜索框 -->
	<van-popup v-model:show="SearchShow" position="top">
		<van-search v-model="keywords" placeholder="请输入关键词" @search="search" />
	</van-popup>

	<!-- 下拉刷新 -->
	<van-pull-refresh v-model="refreshing" @refresh="refresh">
	<!-- 加载列表 -->
	<van-list
		v-model:loading="loading"
		:finished="finished"
		:offset="10"
		:immediate-check="false"
		finished-text="没有更多了"
		@load="load"
	>
	<div class="retailmember">
      <div class="item" v-for="(item, key) in list" :key="key">
          <div class="left">
              <div class="img">
                  <img :src="item.avatar_text" />
              </div>
              <div class="content">
                  <div class="nickname">{{ item.nickname }}</div>
                  <div class="tel">{{ item.mobile }}</div>
              </div>
          </div>
          <div class="right">{{item.createtime_text}}</div>
      </div>
  </div>
	</van-list>
</van-pull-refresh>

<!-- 返回顶部 -->
<van-back-top />

	<!-- 有back方法，不需要底部按钮了 -->
  <!-- <Tabbar /> -->
</template>

<script setup>
	const {proxy} = getCurrentInstance()
	const business = proxy.$business.value

	let list = ref([])
	let page = ref(1)  //分页
  let loading = ref(false) //加载状态
  let finished = ref(false) //是否无更多数据
  let refreshing = ref(false) //下拉刷新
	let SearchShow = ref(false) //搜索框的显示
	let keywords = ref('') //搜索关键词

	onMounted(() => {
    refresh()
  })

	//下拉刷新
	const refresh = async () =>
	{
		page.value = 1
		list.value = []
		finished.value = false
		loading.value = true

		//加载数据方法
		load()
	}

	const load = async () =>
	{
		if(refreshing.value)
		{
		refreshing.value = false
		}

		var params = {
			busid: business.id,
			page: page.value,
			keywords: keywords.value
		}
		var result = await proxy.$POST({
			url: 'sale/myvip',
			params
		})

		//请求发送完毕后，加载状态也就完毕了
		loading.value = false
		if(!result) return false

		if(result.code == 0)
		{
			finished.value = true
			// proxy.$fail(result.msg)
			return false
		}

		list.value = list.value.concat(result.data.list)
		page.value++

	}

	const back = () => proxy.$router.push('/business')
  
</script>

<style scoped>
  @import url('/assets/css/SaleBusiness.css');
</style>